* {
  margin: 0;
  padding: 0;
}
.box {
  width: 100px;
  height: 100px;
  margin: 100px;
}
/* 小于等于768px */
@media screen and (max-width: 768px) {
  .box {
    background-color: pink;
  }
}
@media screen and (min-width: 768px) and (max-width: 996px) {
  .box {
    background-color: blueviolet;
  }
}
@media screen and (min-width: 996px) {
  .box {
    background-color: skyblue;
  }
}